<template>
	<view class="">
		<view class="bg_FFFFFF u-p-20  u-b-r-10">
			<u-tabs :list="tabList" :is-scroll="false" active-color="#EC4E13" :current="tabCurrent" @change="tabChange"></u-tabs>
			<view class="u-p-20" v-if="pays=='wechat'">
				<u-field v-model="params.name" label="真实姓名" placeholder="请输入真实姓名">
				</u-field>
				<view class="u-m-t-20">
					<u-upload @on-success="uploaded" upload-text="收款码上传" @on-remove="remove" :preview-full-image="false"
						:file-list="fileList" imageMode="aspectFit" :show-progress="false" width="200rpx" height="200rpx"
						ref="uUpload" :auto-upload="true" max-count="1" :name="'img'">
					</u-upload>
				</view>
			</view>
			<view class="u-p-20" v-if="pays=='alipay'">
				<u-field v-model="alipay.name" label="真实姓名" placeholder="请输入真实姓名">
				</u-field>
				<u-field v-model="alipay.alipay_account" label="账号" placeholder="请输入支付宝账号">
				</u-field>
			</view>
			<view class="u-p-20" v-if="pays=='bank'">
				<u-field v-model="bankParams.name" label="真实姓名" placeholder="请输入真实姓名">
				</u-field>
				<u-field v-model="bankParams.bank" label="开户行" placeholder="请输入开户行">
				</u-field>
				<u-field v-model="bankParams.bank_no" label="银行卡号" placeholder="请输入银行卡号">
				</u-field>
			</view>
		</view>
		<view class="u-fixed u-b-0 u-w-750 u-auto u-p-20 u-auto">
			<view @click="save"
				class="u-w-700 u-auto u-h-100 u-l-h-100 u-text-center  u-b-r-13 cl_FFF"
				style="background: linear-gradient(-64deg, #FF382C, #FF633F);">提交</view>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>
<script>
	export default {
		data() {
			return {
				tabCurrent:0,
				tabList:[{
					name: '微信',
					type:'wechat'
				},
				{
					name: '支付宝',
					type:'alipay'
				},{
					name: '银行卡',
					type:'bank'
				}],
				pays:'wechat',
				params:{
					method:'',
					name:'',
					qrcode:''
				},
				alipay:{
					method:'',
					name:'',
					alipay_account:''
				},
				bankParams:{
					name:'',
					bank:'',
					bank_no:'',
					method:'bank',
				},
				fileList: [],
			}
		},
		onReady() {
		},
		onLoad() {
			this.member_account_get()
		},
		onShow() {
			
		},
		methods: {
			uploaded(lists) {
				this.params.qrcode =String(lists.id)
			},
			// 移除图片
			remove(index, lists) {
				this.fileList = []
				this.params.qrcode=''
			},
			// 提现账户切换
			tabChange(index){
				this.tabCurrent=index
				this.pays=this.tabList[this.tabCurrent].type
				this.member_account_get()
			},
			// 获取提现账户信息
			async member_account_get(){
				this.$api.member_account_get({method:this.pays}, res => {
					if(res.data.code==1){
						if(res.data.data!=null){
							if(this.pays=='bank'){
								this.bankParams.id=res.data.data.id
								this.bankParams.name=res.data.data.name
								this.bankParams.bank=res.data.data.bank
								this.bankParams.bank_no=res.data.data.bank_no
								
							}else if(this.pays=='wechat'){
								this.fileList=[]
								this.$refs.uUpload.clear()
								this.params.id=res.data.data.id
								this.params.name=res.data.data.name
								this.params.qrcode=res.data.data.qrcode
								this.fileList.push({
									url:res.data.data.qrcode_url
								})
							}else{
								this.alipay.id=res.data.data.id
								this.alipay.name=res.data.data.name
								this.alipay.alipay_account=res.data.data.alipay_account
							}
						}else{
							if(this.pays=='bank'){
								this.bankParams.id=''
								this.bankParams.name=''
								this.bankParams.bank=''
								this.bankParams.bank_no=''
								
							}else if(this.pays=='wechat'){
								this.fileList=[]
								this.$refs.uUpload.clear()
								this.params.id=''
								this.params.name=''
								this.params.qrcode=''
							}else{
								this.alipay.id=''
								this.alipay.name=''
								this.alipay.alipay_account=''
							}
						}
					}
				})
			
				
			},
			// 图片修改
			uploaded(lists) {
				this.params.qrcode=lists.id
			},
			// 移除图片
			remove(index, lists) {
				this.params.qrcode=""
				this.fileList=[]
			},
			save(){
				if(this.pays=='wechat'){
					this.params.method=this.pays
					if(this.params.name==''){
						this.$refs.uToast.show({
							title:'请输入真实姓名',
							type: 'error'
						})
						return
					}
					if(this.params.qrcode==''){
						this.$refs.uToast.show({
							title:'请上传收款码',
							type: 'error'
						})
						return
					}
				}else if(this.pays=='alipay'){
					this.alipay.method=this.pays
					if(this.alipay.name==''){
						this.$refs.uToast.show({
							title:'请输入真实姓名',
							type: 'error'
						})
						return
					}
					if(this.alipay.alipay_account==''){
						this.$refs.uToast.show({
							title:'请输入支付宝账号',
							type: 'error'
						})
						return
					}
				}else{
					if(this.bankParams.name==''){
						this.$refs.uToast.show({
							title:'请输入真实姓名',
							type: 'error'
						})
						return
					}
					if(this.bankParams.bank==''){
						this.$refs.uToast.show({
							title:'请输入开户行',
							type: 'error'
						})
						return
					}
					if(this.bankParams.bank_no==''){
						this.$refs.uToast.show({
							title:'请输入银行卡号',
							type: 'error'
						})
						return
					}
				}
				this.$api.member_account_set(this.pays=='bank'?this.bankParams:this.pays=='wechat'?this.params:this.alipay, res => {
					if (res.data.code == 1) {
						this.$refs.uToast.show({
							title: res.data.msg,
							type: 'success',
							callback: cal => {
								uni.navigateBack()
							}
						})
					}
				})
			}
			
		}
	}
</script>

<style lang="scss" scoped>
</style>
